<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<link rel="stylesheet" href="${base}/rs/css/bootstrap.4.0.css" type="text/css" />
	<link rel="stylesheet" href="${base}/rs/css/app.v2.css" type="text/css" />
	<link rel="stylesheet" href="${base}/rs/css/bootstrap-table.css" type="text/css" />
	<style type="text/css">
		form{margin-top:20px;}
		.zximageTitle{border:1px solid red;}
		.content{height:340px;border:1px solid #c2c2c2;;}
		.btn{width:120px;}
		.chose{display:none}
	</style>
<title>Banner</title>
</head>
<body>
	<form class="form-horizontal" role="form">
		<input type="hidden" id="bannerId" imageTitle="bannerId" value="${msgBanner.bannerId}" />
		<div class="form-group">
			<label class="col-lg-1 control-label" >标题：</label>
			<div class="col-sm-4">
				<input type="text" class="form-control" id="imageTitle" name="imageTitle" value="${msgBanner.imageTitle}" placeholder="请输入标题">
			</div>
		</div>
		<div class="form-group">
			<label  class="col-lg-1 control-label" style="height:105px;line-height:105px;">图片：</label>
			<div class="col-lg-11">
				<div class="famous-upload-pic">
					<#if msgBanner.imageUrl?if_exists  >
						<img src="${msgBanner.imageUrl}"  class="upload-avatar" id="upload-avatar-s" style="width: 80px;height: 80px;"/>
						<#else>
							<img src="${base}/rs/image/icon_addpic.png"  class="upload-avatar" id="upload-avatar" style="width: 80px;height: 80px;"/>
					</#if>
					<input type="file" name="myfiles" class="upload" id="myFile" onchange="ajaxFileUploads('myFile','imageUrl')">
					<input type="hidden" id="imageUrl" <#if msgBanner.imageUrl?if_exists  > value="${msgBanner.imageUrl}"  <#else> value="/image/icon_addpic.png" </#if> />
				</div>
			</div>
		</div>

		<div class="form-group">
			<label class="col-lg-1 control-label inf" style="height:60px;line-height:60px;padding-top:0px;">简介：</label>
			<div class="col-lg-11">
				<textarea id="imageDesc" name="imageDesc" class="col-lg-4 jianjie" rows="3" cols="3">${msgBanner.imageDesc}</textarea>
			</div>
		</div>

		<div class="form-group">
			<label class="col-lg-1 control-label">链接：</label>
			<div class="col-sm-4">
				<input type="text" class="form-control" id="bannerUrl" name="bannerUrl" value="${msgBanner.bannerUrl}" placeholder="请输入链接url">
			</div>
		</div>
		<div class="form-group">
			<label class="col-lg-1 control-label"></label>
			<div class="col-lg-11">
				<button type="button" class="btn btn-success" onclick="updateOrAdd()" >提交 </button>
				<button type="button" class="btn btn-info" style="margin-left:20px;" onclick="closeMsgBanner();" >取消 </button>
			</div>
		</div>
	</form>
<script src="${base}/rs/js/jquery-3.2.0.min.js"></script>
<script src="${base}/rs/js/layer/layer.js"></script>
<script src="${base}/rs/js/layer/commont.js"></script>
<script src="${base}/rs/js/bootstrap.4.0.js"></script>
<script type="text/javascript" src="${base}/rs/js/ajaxfileupload.js"></script>
<script type="text/javascript">

    /**
	 * 关闭
	 * */
    function closeMsgBanner(){
        var url="${base}/msgBanner/listPage";
        window.location.href=url;
	}
    /**
     * 添加或修改
     */
    function updateOrAdd() {
        var bannerId=$("#bannerId").val();
        var imageTitle=$("#imageTitle").val();
        var imageUrl=$("#imageUrl").val();
        var imageDesc=$("#imageDesc").val();

        var bannerUrl=$("#bannerUrl").val();
        if (imageTitle==null || ""==imageTitle){
            layer.alert("请输入标题！");
            return false;
        }
        if (imageUrl==null || ""==imageUrl){
            layer.alert("请选用图片！");
            return false;
        }
        if (imageDesc==null || ""==imageDesc){
            layer.alert("请输入简介！");
            return false;
        }

        $.ajax({
            type: "POST",
            url: "/msgBanner/UpdateOrAddEntity",
            data: {"bannerId":bannerId,"imageTitle":imageTitle,"imageUrl":imageUrl,"imageDesc":imageDesc,"bannerUrl":bannerUrl},
            success: function(result){
                if(1==result.returnInfo.state){
                    layer.open({
                        type: 1
                        ,title: "操作提示"
                        ,offset: "auto"
                        ,id: 'LAY_demo_auto' //防止重复弹出
                        ,content: '<div style="padding: 20px 100px;">操作成功</div>'
                        ,btn: "确定"
                        ,btnAlign: 'c' //按钮居中
                        ,shade: 0 //不显示遮罩
                        ,yes: function(){
                            var url="${base}/rs/msgBanner/listPage";
                            window.location.href=url;
                        }
                    });

                }else{
                    showLayerAlert(result.returnInfo.errorMsg);
                }
            },
            error: function(result){
                parent.showLayerAlert(result);
            }
        });
    }

    function ajaxFileUploads(fileId,resultId){
        //开始上传文件时显示一个图片,文件上传完成将图片隐藏
        //$("#loading").ajaxStart(function(){$(this).show();}).ajaxComplete(function(){$(this).hide();});
        //执行上传文件操作的函数
        $.ajaxFileUpload({
            //处理文件上传操作的服务器端地址(可以传参数,已亲测可用)
            url:'/file/fileUploadCompress?uimageTitle=123',
            secureuri:false,                           //是否启用安全提交,默认为false
            fileElementId:fileId,               //文件选择框的id属性
            dataType:'text',                           //服务器返回的格式,可以是json或xml等
            success:function(data, status){            //服务器响应成功时的处理函数
                data = data.replace(/<pre.*?>/g, '');  //ajaxFileUpload会对服务器响应回来的text内容加上<pre style="....">text</pre>前后缀
                data = data.replace(/<PRE.*?>/g, '');
                data = data.replace("<PRE>", '');
                data = data.replace("</PRE>", '');
                data = data.replace("<pre>", '');
                data = data.replace("</pre>", '');     //本例中设定上传文件完毕后,服务端会返回给前台[0`filepath]
                if(data.substring(0, 1) == 0){         //0表示上传成功(后跟上传后的文件路径),1表示失败(后跟失败描述)
                    $("#upload-avatar").attr("src", data.substring(2));
                    $("#upload-avatar-s").attr("src", data.substring(2));
                    $("#"+resultId).val(data.substring(2));
                    $('#result').html("图片上传成功<br/>");
                }else{
                    $('#result').html('图片上传失败，请重试！！');
                }
            },
            error:function(data, status, e){ //服务器响应失败时的处理函数
                $('#result').html('图片上传失败，请重试！！');
            }
        });
    }
</script>
</body>
</html>

